<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"></meta>
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"></meta>
<title>列表</title>
<span th:replace="common-easyui-mobile::easyui_mobile_js_css"></span>
</head>
<body>

<table id="dgTable">
	</table>
	<div id="tb">
		<div class="m-toolbar">
			<div class="m-title">
				
			</div>
			 <div class="m-left">
                    <a th:href="@{/index}" class="easyui-linkbutton m-back" plain="true" outline="true">首页</a>
                </div>
                
              <div class="m-right">
              		 <a href="javascript:void(0)" onclick="deleteRecord()" class="easyui-linkbutton "  iconCls="icon-remove" plain="true" outline="true">移除</a>
                    <a th:href="@{/add}" class="easyui-linkbutton "  iconCls="icon-add" plain="true" outline="true">添加</a>
                </div>   
		</div>
	</div>
	
	
	<div id="showWin" class="easyui-window" title="5日线" data-options="collapsible:false,maximizable:false,minimizable:false,resizable:true,closed:true,modal:true" style="width:400px;height:185px;padding:10px;">
	  <table style="width:100%;">
	  		<tr >
	  			<th style="width:30%">当前价：</th>
				<td ><span id="currentPrice" ></span></td>	  		
	  		</tr>
	  		<tr>
	  			<th>5日线：</th>
				<td ><span id="currentFiveDayPrice"></span></td>	  		
	  		</tr>
	  		
	  		<tr>
	  			<th>明天5日线：</th>
				<td ><span id="tomorrowFiveDayPrice"></span></td>	  		
	  		</tr>
	  		<tr style="text-align: center">
	  			<td colspan="2"><a href="javascript:void(0)" data-options="iconCls:'icon-cancel'" id="resetBtn" class="easyui-linkbutton" onclick="closeWin()">关闭</a></td>
	  		</tr>
	  </table>
	</div>
	
	
	
	
	<script th:inline="javascript">
	//<![CDATA[
	
	//查看5日线
	function showFiveLineWin(id){
		var rowIndex=getSelectRowIndex(id);
	    //获取操作列
	    var record=$('#dgTable').datagrid('getData').rows[rowIndex];
	    $('#showWin').window('open');
	    
	    $.ajax({
	        type: "POST",
	        url:ctx+'/stock/getStockInfoById',
	        data: {
	        	id:id
	        },
	        success: function (data) {
	        	  $('#currentPrice').html(data.currentPrice);
	        	  $('#currentFiveDayPrice').html(data.currentFiveDayPrice);
	        	  $('#tomorrowFiveDayPrice').html(data.tomorrowFiveDayPrice);
	        },
	        error: function(data) {
	            alert("error:"+data.responseText);
	         }
	  		});
	    //停止刷新
	    stopRefresh()
	}
	
	//关闭窗口
	function closeWin(){
		 $('#showWin').window('close');
		 startRefresh();
	}
	
	//删除记录
	function deleteRecord(){
	    var record=$('#dgTable').datagrid('getSelected');
		if (record) {
			   var recordId=record.id;
			 //提示是否删除
			 $.messager.confirm("确认", "您确认删除["+record.name+"]这条记录吗？", function (action) {
		            if (action) {
	                    $.ajax({
	            			cache: true,
	            			type: "POST",
	            			url:ctx+'/stock/delete',
	            			data:{
	            				id:recordId
	            			},
	            			async: false,
	            		    error: function(request) {
	            		    	$.messager.alert('提示信息',"系统正在升级，请联系管理员或稍后再试！");
	            		    },
	            		    success: function(data) {
	            		    	$.messager.alert('提示信息',data.msg);
	            		    	$("#dgTable").datagrid('reload');
	            		    }
	            		
	            		})
	                    
		            }
		            })
			
		}else{
			 $.messager.alert("操作提示", "请选择要删除的记录！","warning");  
		}
	}
	
	
	 $('#dgTable').datagrid({  
			url:ctx+'/stock/list',
			method:'post',
		    queryParams: {
			},
			fit:true,
			pageSize: 10,
			fitColumns:true,
			striped: true,
			singleSelect:true,
			pagination: false,  
			rownumbers: true,
			scrollbarSize:0,
			columns:[[
			          {field:'id',title: '栏目',align: 'center',width: 58,hidden:true},
			          {field:'code',title: '代码',align: 'center',width: 65},
			          {field:'name',title: '名称',align: 'center',width: 60}, 
			          {field:'startPrice',title: '今开',align: 'center',width: 60} , 
			          {field:'miniPrice',title: '最低',align: 'center',width: 60}  , 
			          {field:'maxiPrice',title: '最高',align: 'center',width: 60}, 
			          {field:'yesterdayPrice',title: '昨收',align: 'center',width: 60} , 
			          {field:'currentPrice',title: '当前价',align: 'center',width: 60,formatter:function(val,rec){
			        		if(parseFloat(val)>0){
								return '<span style="color:red">'+val+'</span>'		        		 
				        	 }else{
				        		return '<span style="color:green">'+val+'</span>'
				        	 }
				       }} , 
				       	//{field:'currentFiveDayPrice',title: '5日线',align: 'center',width: 60} , 
				       	//{field:'tomorrowFiveDayPrice',title: '明天5日线',align: 'center',width: 60} , 
			          {field:'dayFl',title: '当日盈亏',align: 'center',width: 60,formatter:function(val,rec){
			        	 if(parseFloat(val)>0){
							return '<span style="color:red">'+val+'</span>'		        		 
			        	 }else{
			        		return '<span style="color:green">'+val+'</span>'
			        	 }
			          }} ,      
			          {field:'dayFlPercent',title: '比率',align: 'center',width: 60,formatter:function(val,rec){
				        	 if(parseFloat(val)>0){
									return '<span style="color:red">'+val+'%'+'</span>'		        		 
					        	 }else{
					        		return '<span style="color:green">'+val+'%'+'</span>'
					        	 }
					  }} ,  
			          {field:'buyCount',title: '数量',align: 'center',width: 60}, 
			          {field:'daySumFl',title: '当日总盈亏',align: 'center',width: 60,formatter:function(val,rec){
				        	 if(parseFloat(val)>0){
									return '<span style="color:red">'+val+'</span>'		        		 
					        	 }else{
					        		return '<span style="color:#228B22">'+val+'</span>'
					        	 }
					  }} , 
			          {field:'buyPrice',title: '买入价',align: 'center',width: 60}, 
			          {field:'flPercent',title: '总比率',align: 'center',width: 60,formatter:function(val,rec){
				        	 if(parseFloat(val)>0){
									return '<span style="color:red">'+val+'%'+'</span>'		        		 
					        	 }else{
					        		return '<span style="color:#228B22">'+val+'%'+'</span>'
					        	 }
					  }} ,    
			          {field:'sumFl',title: '总盈亏',align: 'center',width: 60},    
			          {field:'currentFiveDayPrice',title: '5日线',align: 'center',width: 60,formatter:function(val,rec){
				        	return "<a title='查看' href='javascript:void(0)' onclick=showFiveLineWin('"+rec.id+"')>查看</a>";

			          }
			          }
			]]
			,toolbar:$('#tb')
		  });
	 
	 
	 $.extend($.fn.datagrid.methods,{
		    columnMoving: function(jq){
		        return jq.each(function(){
		            var target = this;
		            var cells = $(this).datagrid('getPanel').find('div.datagrid-header td[field]');
		            cells.draggable({
		                revert:true,
		                cursor:'pointer',
		                edge:5,
		                proxy:function(source){
		                    var p = $('<div class="tree-node-proxy tree-dnd-no" style="position:absolute;border:1px solid #ff0000"/>').appendTo('body');
		                    p.html($(source).text());
		                    p.hide();
		                    return p;
		                },
		                onBeforeDrag:function(e){
		                    e.data.startLeft = $(this).offset().left;
		                    e.data.startTop = $(this).offset().top;
		                },
		                onStartDrag: function(){
		                    $(this).draggable('proxy').css({
		                        left:-10000,
		                        top:-10000
		                    });
		                },
		                onDrag:function(e){
		                    $(this).draggable('proxy').show().css({
		                        left:e.pageX+15,
		                        top:e.pageY+15
		                    });
		                    return false;
		                }
		            }).droppable({
		                accept:'td[field]',
		                onDragOver:function(e,source){
		                    $(source).draggable('proxy').removeClass('tree-dnd-no').addClass('tree-dnd-yes');
		                    $(this).css('border-left','1px solid #ff0000');
		                },
		                onDragLeave:function(e,source){
		                    $(source).draggable('proxy').removeClass('tree-dnd-yes').addClass('tree-dnd-no');
		                    $(this).css('border-left',0);
		                },
		                onDrop:function(e,source){
		                    $(this).css('border-left',0);
		                    var fromField = $(source).attr('field');
		                    var toField = $(this).attr('field');
		                    setTimeout(function(){
		                        swapField(fromField,toField);
		                        $(target).datagrid();
		                        $(target).datagrid('columnMoving');
		                    },0);
		                }
		            });
		            
		            // swap Field to another location
		            function swapField(from,to){
		                var columns = $(target).datagrid('options').columns;
		                var cc = columns[0];
		                _swap(from,to);
		                function _swap(fromfiled,tofiled){
		                    var fromtemp;
		                    var totemp;
		                    var fromindex = 0;
		                    var toindex = 0;
		                    for(var i=0; i<cc.length; i++){
		                        if (cc[i].field == fromfiled){
		                            fromindex = i;
		                            fromtemp = cc[i];
		                        }
		                        if(cc[i].field == tofiled){
		                            toindex = i;
		                            totemp = cc[i];
		                        }
		                    }
		                    cc.splice(fromindex,1,totemp);
		                    cc.splice(toindex,1,fromtemp);
		                }
		            }
		        });
		    }
		});
	 
	
	 //每隔10秒刷新一次
	 var refreshEvent;
	 var timer_is_on = 0;
	 function refreshPage(){
		 refreshEvent= setTimeout(function(){location.reload()},15000); 
	 }
	 //开始刷新页面
	 function startRefresh(){
		 if (!timer_is_on) {
		      timer_is_on = 1;
		      refreshPage();
		  }
	 }
	 
	 //停止刷新页面
	 function stopRefresh(){
		 clearTimeout(refreshEvent);
		 timer_is_on = 0;
	 }
	 
	 //默认开启
	 startRefresh();
	 
	//]]>
	</script>
</body>
</html>